<link rel="stylesheet" type="text/css" href="<?php echo(JS_LIBS);?>bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css">
<link rel="stylesheet" type="text/css" href="<?php echo(JS_LIBS);?>ios7-switch/ios7-switch.css"  />
<link rel="stylesheet" type="text/css" href="<?php echo(JS_LIBS);?>jquery-icheck/skins/square/green.css" />
<!-- <link rel="stylesheet" type="text/css" href="<?php echo(JS_LIBS);?>image-crop/crop.css">  -->
<link rel="stylesheet" type="text/css" href="<?php echo(JS_LIBS);?>croppic/assets/css/main.css" >
<link rel="stylesheet" type="text/css" href="<?php echo(CSS);?>noticies.css">

<div class="page-heading">
    	<h1><i class=' icon-newspaper-1'></i>Notícia General</h1>
    </div>
	<div class="row">
		<div class="col-md-3">
			<div class="btn-group new-message-btns stacked">
				<a href="javascript:publicar_noticia();" class="btn btn-primary btn-lg btn-block text-left"> Publicar</a>
			</div>	
		<p>
		<div class="widget">
			<div class="widget-header" >
				<h2><strong>Editar Noticia</strong></h2>
				<div class="additional-btn">
					<a class="widget-toggle closed" href="#"><i class="icon-down-open-2"></i></a>
				</div>
			</div>
			<div class="widget-content padding ">						
				<div id="horizontal-form">
					<form role="form" class="form-horizontal">
						<div class="form-group">
							<label class="col-sm-4 ">Idioma</label>
							<div class="col-sm-8" style="width:60%;">
								<select id="idioma" class="form-control">
									<option value="1">Català</option>
									<option value="2">Castellà</option>
									<option value="3">Anglès</option>
								</select>
							</div>
						 </div>
						 
						 <div class="form-group">
							<label class="col-md-4 col-xs-4 col-sm-4 ">Categoria</label>
							<div class="col-md-6 col-xs-6 col-sm-6">
								   <input id="categoria" type="text" class="col-md-12 form-control" placeholder="Nom categoria..." autocomplete="on" />
							</div>
							<div class="col-md-2 col-xs-2 col-sm-2">
								<button class="btn btn-sm btn-default" type="button" data-toggle="modal" data-target="#editar_categoria"><i class="fa fa-edit" ></i></button>
							</div>
							
						 </div>
						 
						<div class="form-group">
							<label class="col-sm-4 " for="inputEmail3">Autor</label>
							<div class="col-sm-8">
								<input type="text" id="autor" class="form-control" maxlength="75" required="required">
							</div>
						 </div>
						  <div class="form-group">
							<label class="col-sm-4">Publicada</label>
							<div class="col-sm-8">
								  <input type="checkbox" id="publicada" >
							</div>
						  </div>
						 <div class="form-group">
							<label class="col-sm-4 " for="inputEmail3">Data publicació</label>
								<div class="col-sm-8">
						            <div class='input-group date' id="data_publicacion">
			                    		<input type='text' class="form-control" data-date-format="DD/MM/YYYY hh:mm" required="required" readonly/>
			                    		<span class="input-group-addon"><span class="fa fa-calendar"></span></span>
			                		</div>
								</div>
						 </div>
						 <div class="form-group">
							<label class="col-sm-4" for="inputEmail3">Data Caducitat</label>
							<div class="col-sm-8">
						               <div class="input-group date" id='data_caducidad'>
								        <input type="text" class="form-control" data-date-format="DD/MM/YYYY hh:mm" required="required" readonly/>
										<span class="input-group-addon"><span class="fa fa-calendar"></span></span>
								    </div>
							</div>
						 </div>
						 <div class="form-group">
							<label class="col-sm-4 " for="inputEmail3">Galería Associada</label>
							<div class="col-sm-8">
								<input id="galeria_asociada" type="text" class="col-md-12 form-control" placeholder="Nom galería..." autocomplete="on" />
							</div>
						 </div>
					</form>
				</div>
			</div>
		</div>
		<!-- AFEGIR CONTINGUT  -->
		<div class="widget ">
			<div class="widget-header ">
				<h2><strong>Afegir contingut a la notícia</strong></h2>
				<div class="additional-btn">
					<a class="widget-toggle" href="#"><i class="icon-down-open-2"></i></a>
				</div>
			</div>
			<div class="widget-content padding ">
			
				<div class="list-group menu-message" style="margin-left:1em;">
					<h4>Sel·leccionar fitxer:</h4>
					<input type="file" name="archivoImage" id="archivoImage" class="btn-sm btn-primary" />
					<input type="button" value="Pujar fitxer" id="botonSubidor" class="btn-sm btn-blue-2" onclick="javascript:uploadContenidoNoticia();" />
				</div>
					<h4 style="margin-left:1em;">Contingut afegit:</h4>
					<ul id="listado_contenido_añadido">
	                </ul>
	             
			</div>
		</div>
		<!-- FIN AFEGIR CONTINGUT  -->
		<!-- SECCIO NOTIFICACIONS  -->
		<div class="widget">
			<div class="widget-header">
				<h2><strong>Notificacio per mail</strong></h2>
				<div class="additional-btn">
					<a class="widget-toggle" href="#"><i class="icon-down-open-2"></i></a>
				</div>
			</div>
			<div class="widget-content padding" >
				<div class="list-group menu-message">
					<a href="" class="list-group-item" data-toggle="modal" data-target="#afegir-email"><i class=" icon-mail-3"></i>Afegir email</a>
				</div>
				<h4 style="margin-left:1em;">Adreçes</h4>
				<ul id="listado_emails">
                </ul>
                <div class="list-group menu-folders">
						<div class="col-md-6 col-xs-6 col-sm-6">
							<h5>Adjuntar Contingut</h5>
						</div>
						<div class="col-md-6 col-xs-6 col-sm-6">
							<div class="iswitch ios-switch-facebook off" id="adjuntar_contenido_mail" onclick="javascript:toggle('#'+this.id,'on','off');">
							<div class="on-background background-fill"></div>
							<div class="state-background background-fill"></div>
							<div class="handle"></div></div>
						</div>
				</div>
			</div>
		</div>
		
		<div class="widget">
			<div class="widget-header">
				<h2><strong>Xarxes socials</strong></h2>
				<div class="additional-btn">
					<a class="widget-toggle" href="#"><i class="icon-down-open-2"></i></a>
				</div>
			</div>
			<div class="widget-content padding" >
				<div class="list-group menu-folders">
					<div class="col-md-6 col-xs-6 col-sm-6">
						<button class="btn btn-facebook btn-block"><i class="fa fa-facebook"></i> Facebook</button>
					</div>
					<div class="col-md-6 col-xs-6 col-sm-6">
						<div class="iswitch ios-switch-facebook off" id="facebook" onclick="javascript:toggle('#'+this.id,'on','off');">
						<div class="on-background background-fill"></div>
						<div class="state-background background-fill"></div>
						<div class="handle"></div></div>
					</div>
				  	<div class="col-md-6 col-xs-6 col-sm-6">
						<button class="btn btn-twitter btn-block"><i class="fa fa-twitter"></i> Twitter </button>
					</div>
					<div class="col-md-6 col-xs-6 col-sm-6">
						<div class="iswitch ios-switch-primary off" id="twitter" onclick="javascript:toggle('#'+this.id,'on','off');">
						<div class="on-background background-fill"></div>
						<div class="state-background background-fill"></div>
						<div class="handle"></div></div>
					</div>
					<div class="col-md-6">
						<button class="btn btn-google-plus btn-block"><i class="fa fa-google-plus"></i> Google Plus</button>
					</div>
					<div class="col-md-6">
						<div class="iswitch ios-switch-danger off" id="google_plus" onclick="javascript:toggle('#'+this.id,'on','off');">
						<div class="on-background background-fill"></div>
						<div class="state-background background-fill"></div>
						<div class="handle"></div></div>
					</div>
					<br>
				</div>
			</div>
		</div>
	</div>
	<!-- FIN SECCION NOTIFICACIONES -->
	<!-- CONTENIDO DERECHA style="border-left: 5px solid; border-color:#ffc052;" -->
	<div class="col-md-9" >			
		<div class="widget" >	
			<div class="widget">
				<div class="widget-header ">
					<h2><strong>Contingut</strong></h2>
				</div>
				<div class="widget-content padding" >
								<div class="widget" id="div_imagen_portada">
									<div class="widget-header transparent ">
										<a href=""><h2 class="widget-toggle"><strong><i class="fa fa-plus"></i> Imatge de portada</strong></h2></a>
										<div class="additional-btn">
											<a class="widget-toggle" href="#"><i class="icon-down-open-2"></i></a>
										</div>
									</div>
									<div class="widget-content padding" style="display:none;">
										<div class="col-md-12">
											<div id="croppic"></div>
											<span class="btn" id="cropContainerHeaderButton">Sel·leccionar imatge</span>
										</div>
									</div>
								</div>
								
								<div class="form-group">
									<label class="col-sm-2 control-label" for="inputEmail3">Avantítol</label>
									<div class="col-sm-10">
										<input type="text" id="avantitol" maxlength="100" class="form-control">
										<p class="help-block">Max <i id="contador_avantitol">100</i> caràcters</p>
									</div>
								</div>
								<div class="form-group">
									<label class="col-sm-2 control-label" for="inputEmail3">Títol</label>
									<div class="col-sm-10">
										<input type="text" id="titol" maxlength="100" class="form-control">
										<p class="help-block">Max <i id="contador_titol">100</i> caràcters</p>
									</div>
								</div>
								<div class="form-group">
									  <label class="col-sm-2 control-label" >Resum</label>
									  <div class="col-sm-10">
										<textarea class="form-control" rows="5" maxlength="250" id="resum"></textarea>
										<p class="help-block">Max <i id="contador_resum">250</i> caràcters</p>
									  </div>
								</div>
								<div class="form-group">
									<label class="col-sm-2 control-label" >Enllaç del vídeo</label>
									<div class="col-sm-10">
										<input type="text" id="enlace_video" class="form-control">
										<p class="help-block">Desde youtube copiar , compartir->insertar : www.youtube.com/embed/f6XTk_C9PIQ</p>
									</div>
								</div>
								<div class="form-group" id="texto_email" style="display:none;">
										<label class="col-sm-2 control-label" >Redactar Email</label>
										<div class="col-sm-10">
											<textarea class="form-control" rows="5" maxlength="512" id="contenido_email"></textarea>
											<p class="help-block">Max <i id="contador_email">512</i> caràcters</p>
										  </div>
								</div>
								<div class="form-group" id="texto_twitter" style="display:none;">
										<label class="col-sm-2 control-label" >Text Tweet</label>
										<div class="col-sm-10">
											<textarea class="form-control" rows="5" maxlength="140" id="contenido_twitter"></textarea>
											<p class="help-block">Max <i id="contador_twitter">140</i> caràcters</p>
										</div>
								</div>
								<div class="form-group">
									  <label class="col-sm-2 col-md-2 control-label" >Contingut</label>
									  <div class="col-sm-10 col-md-10">
											<textarea name="editor_texto" id="editor_texto" ></textarea>
									  </div>
								</div>
			<!-- IMAGENES GALERIA ASOCIADA -->
			<div class="row" style="margin-left:2em;">
				<div class="col-sm-12">
					<div id="titulo_galeria"></div>
					<div id="visor_imagenes_galeria" class="gallery-wrap"></div>
				</div>
			</div>
			<!-- FIN IMAGENES GALERIA ASOCIADA -->
		</div>
	</div>
</div>
</div>	
	<!------------->
	<!--- MODALS -->
	<!------------->
	<!-- MODAL AÑADIR EMAIL -->
	<?php include('modals/add_email.php');?>
	<!-- FIN MODAL AÑADIR EMAIL -->
	<!-- MODAL EDICION CATEGORIA -->
	<?php include('modals/editar_categoria.php');?>
	<!-- FIN MODAL EDICION CATEGORIA -->
	<!-- MODAL RESULTADO PUBLICACION NOTICIA -->
	<?php include('modals/result_publicacion.php');?>
		

	<!-- FIN RESULTADO PUBLICACION NOTICIA -->

	<script src="<?php echo(JS);?>moment.min.js"></script>
	<script src="<?php echo(JS_LIBS);?>bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
	<script src="<?php echo(JS_LIBS);?>ckeditor/ckeditor.js"></script>
	<script src="<?php echo(JS_LIBS);?>jquery-icheck/icheck.min.js"></script>
<!-- <script src="<?php echo(JS_LIBS);?>image-crop/crop.js"></script> -->
    <script src="<?php echo(JS_LIBS);?>typeaheadjs/js/jquery.mockjax.js"></script>
    <script src="<?php echo(JS_LIBS);?>typeaheadjs/js/bootstrap-typeahead.js"></script>
    <script src="<?php echo(JS_LIBS);?>croppic/croppic.min.js"></script>
    <script src="<?php echo(JS);?>noticies/init.js"></script>
    <script src="<?php echo(JS);?>noticies/crear_noticia.js"></script>	
   